Masden - Charity Nonprofit HTML Template

Thank you


First of all, thank you for purchasing the Masden HTML Template. You can find the detailed information about the template in this document. If there is anything you cannot find in this document, you can send an e-mail via the profile page.

1Installation

Follow the steps below to setup your site template:

  1. Unzip the downloaded package and open the Template folder to find all the template files. You wil get Masden-b and Masden-c folder in there. Both are containing html folder. You will need to upload you desire template to your hosting web server using FTP in order to use it on your website.
  2. Below is the folder structure and needs to be uploaded to your website root directory:
    • html/css - Stylesheet files
    • html/fonts - Icon/fonts files
    • html/images - Image files
    • html/inc - contact from file
    • html/js - js files
    • html/vendor - plugins files
  3. You need to upload all or specific HTML files as per your need.
  4. And now you are ready to go to generate your webiste with this awesome template.

2HTML Structure

We are used Bootstrap4 framework in this template.
The general template structure is the same throughout the template. Here is the general structure.

#Favicon Settings

Favicon Will be found in head section.

        
        <link rel="shortcut icon" href="assets/images/favicon.png" type="image/x-icon">
        <link rel="icon" href="assets/images/favicon.png" type="image/x-icon">

#Logo Settings

The Logo will be found in the Theme Main Menu section.

        <div class="logo"><a href="index.html"><img src="assets/images/logo.png" alt=""></a></div>

You can replace any .jpg .png .svg logo.

#Fonts Settings

Masden (Masden- Template) we use google fonts Roboto and Inter
You can change both fonts form head section: 

            <link href="https://fonts.googleapis.com/css2?family=inter:wght@400;500;600;700&family=Roboto:wght@400;500;700&display=swap" rel="stylesheet">

#Contact Form

Activeted PHP Contact Form

You can edit your form simply and quickly. Open contact.php in inc folder and change following area


    <?php

    require_once('phpmailer/class.phpmailer.php');
    require_once('phpmailer/class.smtp.php');
    
    $mail = new PHPMailer();
    
    //$mail->SMTPDebug = 3;                               // Enable verbose debug output
    $mail->isSMTP();                                      // Set mailer to use SMTP
    $mail->Host = 'yourhost.com';  // Specify main and backup SMTP servers
    $mail->SMTPAuth = true;                                             // Enable SMTP authentication
    $mail->Username = 'username.com';                 // SMTP username
    $mail->Password = 'password';             // SMTP password
    $mail->SMTPSecure = true;                            // Enable TLS encryption, `ssl` also accepted
    $mail->Port = 465;                                    // TCP port to connect to
    
    $message = "";
    $status = "false";
    
    if( $_SERVER['REQUEST_METHOD'] == 'POST' ) {
        if( $_POST['form_name'] != '' AND $_POST['form_email'] != '' AND $_POST['form_subject'] != '' ) {
    
            $name = $_POST['form_name'];
            $email = $_POST['form_email'];
            $subject = $_POST['form_subject'];
            $phone = $_POST['form_phone'];
            $message = $_POST['form_message'];
    
            $subject = isset($subject) ? $subject : 'New Message | Contact Form';
    
            $botcheck = $_POST['form_botcheck'];
    
            $toemail = 'yourmail@info.com'; // Your Email Address
            $toname = 'thememx'; // Your Name
    
            if( $botcheck == '' ) {
    
                $mail->SetFrom( $email , $name );
                $mail->AddReplyTo( $email , $name );
                $mail->AddAddress( $toemail , $toname );
                $mail->Subject = $subject;
    
                $name = isset($name) ? "Name: $name

" : '';
                $email = isset($email) ? "Email: $email

" : '';
                $phone = isset($phone) ? "Phone: $phone

" : '';
                $message = isset($message) ? "Message: $message

" : '';
    
                $referrer = $_SERVER['HTTP_REFERER'] ? '


This Form was submitted from: ' . $_SERVER['HTTP_REFERER'] : '';
    
                $body = "$name $email $phone $message $referrer";
    
                $mail->MsgHTML( $body );
                $sendEmail = $mail->Send();
    
                if( $sendEmail == true ):
                    $message = 'We have successfully received your Message and will get Back to you as soon as possible.';
                    $status = "true";
                else:
                    $message = 'Email could not be sent due to some Unexpected Error. Please Try Again later.

Reason:
' . $mail->ErrorInfo . '';
                    $status = "false";
                endif;
            } else {
                $message = 'Bot Detected.! Clean yourself Botster.!';
                $status = "false";
            }
        } else {
            $message = 'Please Fill up all the Fields and Try Again.';
            $status = "false";
        }
    } else {
        $message = 'An unexpected error occured. Please Try Again later.';
        $status = "false";
    }
    
    $status_array = array( 'message' => $message, 'status' => $status);
    echo json_encode($status_array);
    ?>>

#CSS Structure

The style.css file contains all of the specific stylings for the page. 

                	
    /* Masden HTML Template  */

    /************ TABLE OF CONTENTS ***************
    1. Fonts
    2. Reset css
    3. Global css
    4. Header Section
    5. Banner Section
    6. Reservation form
    7. About Section
    8. Feature
    9. Sponsor
    10. Room
    11. Gallery
    12. Testimonial
    13. CTA
    14. Blog
    15. Footer
    16. Funfact
    17. Faq
    18. Pricing plan
    19. Newsletter
    20. Gallery
    21. Page Title
    22. Feature
    23. Video Section
    24. Services
    25. Menu
    26. Places
    27. Resturant
    28. Contact form
    
    
    
    /*** 
    
    ====================================================================
            Fonts
    ====================================================================
    
    ***/
    
    @import url('fontawesome-all.css');
    @import url('animate.css');
    @import url('custom-animate.css');
    @import url('jquery-ui-1.9.2.custom.min.css');
    @import url('nice-select.css');
    @import url('flaticon.css');
    @import url('owl.css');
    @import url('jquery.fancybox.min.css');
    @import url('scrollbar.css');
    @import url('swiper.min.css');

#Javascript Structure

        
            <script src="assets/js/jquery.js"></script>
            <script src="assets/js/bootstrap.bundle.min.js"></script>
            <script src="assets/js/jquery.fancybox.js"></script>
            <script src="assets/js/isotope.js"></script>
            <script src="assets/js/owl.js"></script>
            <script src="assets/js/appear.js"></script>
            <script src="assets/js/wow.js"></script>
            <script src="assets/js/scrollbar.js"></script>
            <script src="assets/js/TweenMax.min.js"></script>
            <script src="assets/js/swiper.min.js"></script>
            <script src="assets/js/jquery.ajaxchimp.min.js"></script>
            <script src="assets/js/parallax-scroll.js"></script>
            <script src="assets/js/jquery-ui-1.9.2.custom.min.js"></script>
            <script src="assets/js/jquery.nice-select.min.js"></script>

#Mailchimp Settings:

Enter your subscription list url here:

#Credits

#Support

Please send us mail hafizurbrohr@gmail.com You will get a reply 24 hours